window.onload = function () {
    var ulbox = document.querySelector('.left ul');
    var links = ulbox.querySelectorAll('li>a')
    var leftbox = document.querySelector('.left');
    var ulheight = ulbox.offsetHeight;
    var leftheight = leftbox.offsetHeight;
    var bouce = 100;
    var maxmove = bouce;
    var minmove = leftheight - ulheight - bouce;
    var maxstop = 0;
    var minstop = leftheight - ulheight;
    // console.log(ulheight,leftheight);
    for(var i = 0 ;i<links.length;i++ ){
        // console.log(i);
        // links[i].index = i;
        links[i].index = i;
    }
    var aheight = links[0].offsetHeight;
    var startY = 0,
        moveY = 0,
        distanceY = 0,
        currentY = 0;
    // ulbox.addEventListener('touchstart', function (e) {
    //     startY = e.targetTouches[0].clientY;
    //     // console.log(startY,'startY');

    // })

    // ulbox.addEventListener('touchmove', function (e) {
    //     moveY = e.targetTouches[0].clientY;

    //     distanceY = moveY - startY;
                                                                                          
    //     // console.log(distanceY,'distanceY');
    //     // if (currentY + distanceY > maxmove || currentY + distanceY < minmove) {
    //     //     return;
    //     // }
    //     ulbox.style.transition = "none";
    //     // ulbox.style.top = (currentY + distanceY) + 'px';

    // })

    // ulbox.addEventListener('touchend', function (e) {
    //     if (currentY + distanceY > maxstop) {
    //             ulbox.style.transition = "top 0.2s";
    //             ulbox.style.top = maxstop + 'px';
    //             currentY = 0;
    //             // console.log(currentY,1111);
           
    //     }
    //     else if ( currentY + distanceY < minstop) {
            
    //             ulbox.style.transition = "top 0.2s";
    //             ulbox.style.top = minstop + 'px';
    //             currentY = minstop;
            
    //     }else{
    //         currentY += distanceY;
    //     }

    // })

    //  ulbox.addEventListener('touchstart',function(e){
    //     console.log(e.targetTouches,'touchstart,targetTouches');
    //     console.log(e.currentTouches,'touchstart,currentTouches');
    //     console.log(e.changedTouches,'touchstart,changedTouches');
    //  })
    //  ulbox.addEventListener('touchmove',function(e){
        
    //     console.log(e.targetTouches,'touchmove,targetTouches');
    //     console.log(e.currentTouches,'touchmove,currentTouches');
    //     console.log(e.changedTouches,'touchmove,changedTouches');
    // })
    // ulbox.addEventListener('touchend',function(e){
    //     console.log(e.targetTouches,'touchend,targetTouches');
    //     console.log(e.currentTouches,'touchend,currentTouches');
    //     console.log(e.changedTouches,'touchend,changedTouches');
    // })

      ulbox.addEventListener('touchstart',function(e){
        startY = e.targetTouches[0].clientY;

     })
     var currenttop = 0;
     ulbox.addEventListener('touchmove',function(e){
        moveY = e.targetTouches[0].clientY;
        distanceY = moveY - startY;
        // console.log(currenttop+distanceY,'move');
        // console.log(distanceY,'distanceY');
        if(currenttop+distanceY > maxmove ||currenttop+distanceY < minmove){
            
        }else{
            ulbox.style.transition = "none";
            ulbox.style.top = (currenttop + distanceY) + 'px';
        }
    //    console.log(distanceY,'distanceY');
    })
    ulbox.addEventListener('touchend',function(e){
       
        // console.log(distanceY,top);
        if(currenttop+distanceY > maxstop ){
            ulbox.style.transition = "top .3s";
            ulbox.style.top = maxstop + 'px';
            currenttop = maxstop;
        }
        if(currenttop+distanceY < minstop){
            ulbox.style.transition = "top .3s";
            ulbox.style.top = minstop + 'px';
            currenttop = minstop;
        }
        currenttop = parseInt(ulbox.style.top);//获取当前的top值
        // console.log(currenttop,'currenttop');
        // console.log(currenttop+distanceY,'end');
    })

    if ('addEventListener' in document) {
        document.addEventListener('DOMContentLoaded', function() {
            FastClick.attach(document.body);
        }, false);
    }
//    yd.tap(ulbox,function(e){
       //这里传的是个函数，还没调用，e为形参，可以随便取
    //   console.log(e.target); 
    ulbox.addEventListener('click',function(e){
        for(var i = 0 ;i<links.length;i++ ){

            links[i].classList.remove('active');
        }
         e.target.classList.add('active');
         var index = e.target.index;
         console.log(index);
        //  console.log(aheight);
         if(-index *aheight < minstop){
            //  return;
            ulbox.style.transition = "top .3s";
             ulbox.style.top = minstop + 'px';
             currenttop = minstop;
         }else{
            ulbox.style.transition = "top .3s";
            ulbox.style.top = -index *aheight + 'px';
            currenttop = -index *aheight ;
         }
    })
 
    
    var myScroll = new IScroll('.product',{
        scrollbars: true,
         mouseWheel: true,
    });

}